<template>
  <div class="quota_content">
    <div class="quota_content_header jzt-flex-bt">
      <!-- <template v-if="currNode.parentId !== 0"> -->
      <el-button :icon="Plus" type="primary" @click="handelClickNewAdd">新增定额</el-button>
      <el-button type="info" link @click="isFullScreen = true">
        <img src="@/assets/images/open-full-icon.png" width="24" alt="" />
      </el-button>
      <!-- </template> -->
    </div>

    <!-- content组要内容部分 table组件 -->
    <fullScreenTableCom :Data="data" :projectId="projectId" :saveLocalStore="saveLocalStore" />

    <!-- 工程验收标准 -->
    <div class="accept">
      <el-drawer v-model="data.isAccept" class="jzt-drawer" title="工程验收标准" :with-header="false">
        <div class="accept_content">
          <div class="header">
            <div class="header_left">
              <span>工程验收标准</span>
            </div>
            <div class="header_right">
              <el-cascader
                :options="data.options"
                :show-all-levels="false"
                placeholder="引用平台标准"
                style="width: 130px"
                @change="handelChangeCascader"
              />
            </div>
          </div>
          <div class="content">
            <el-from>
              <el-form-item label-width="100px" label="工艺标准说明">
                <el-input type="textarea" v-model="data.acceptanceCriteria.standardDesc"></el-input>
              </el-form-item>
              <el-form-item label-width="100px" label="优劣势说明">
                <el-input type="textarea" v-model="data.acceptanceCriteria.shortcomingDesc"></el-input>
              </el-form-item>
              <el-form-item label-width="100px" label="工艺标准图">
                <!-- 上传图片 -->
                <!-- {{ imgFileList.length }} -->
                <el-upload
                  class="avatar-uploader"
                  ref="uploadImg"
                  v-model:file-list="imgFileList"
                  :show-file-list="false"
                  multiple
                  :limit="10"
                  list-type="picture-card"
                  :auto-upload="false"
                  :on-change="
                    (file, fileList) => {
                      handleAvatarChangeIcon(file, fileList);
                    }
                  "
                  :on-preview="
                    file => {
                      reviewFile(file);
                    }
                  "
                >
                  <template #trigger>
                    <el-button :disabled="data.acceptanceCriteria.picUrlList?.length >= 9">
                      <el-icon class="f24"><Plus /></el-icon>
                    </el-button>
                  </template>
                  <template #tip>
                    <p class="f12 mt10" style="color: #86909c">支持doc/docx/pdf/jpg，最多上传9个。</p>
                  </template>
                </el-upload>
                <div class="imgs">
                  <div
                    class="standard_diagram_item mt10"
                    v-for="(item, index) in data.acceptanceCriteria.picUrlList"
                    :key="index"
                  >
                    <span class="close_icon"
                      ><el-icon size="20" color="#FF3333" @click="handelClickDeletPicter(item, index)"
                        ><CircleCloseFilled /></el-icon
                    ></span>
                    <img :src="item" />
                  </div>
                </div>
              </el-form-item>
              <el-form-item label-width="100px" label="工艺标准视频">
                <!-- 上传视频 -->
                <el-upload
                  class="avatar-uploader"
                  ref="uploadVideo"
                  list-type="picture-card"
                  :auto-upload="false"
                  :show-file-list="false"
                  :on-change="
                    (file, fileList) => {
                      handleAvatarChangeIcon(file, fileList, 'video');
                    }
                  "
                >
                  <div style="display: flex; flex-direction: column; align-items: center; color: #86909c; position: absolute">
                    <el-icon class="f24"><Plus /></el-icon>
                    <p class="f12" style="line-height: 22px; color: #86909c">上传工艺视频</p>
                  </div>
                </el-upload>
                <div class="video_content mt10">
                  <div class="video_item" v-for="(item, i) in data.acceptanceCriteria.videoUrlList" :key="i">
                    <span class="close_icon"
                      ><el-icon size="20" color="#FF3333" @click="handelClickDeletVideo(item, index)"
                        ><CircleCloseFilled /></el-icon
                    ></span>
                    <video controls>
                      <source :src="item" type="video/mp4" />
                    </video>
                  </div>
                </div>
              </el-form-item>
            </el-from>
          </div>
          <div class="fottor">
            <el-button type="" @click="handelClickBack">取消</el-button>
            <el-button type="primary" @click="handelClickOk">确定引用</el-button>
          </div>
        </div>
      </el-drawer>
    </div>

    <!-- 全屏table展示弹窗 -->
    <el-dialog v-model="isFullScreen" fullscreen modal-class="quota-full-dialog">
      <template #header>
        <span class="dialog_title">定额模板</span>
      </template>
      <div class="dialog_content quota-full-dialog-content">
        <!-- content组要内容部分 table组件 -->
        <fullScreenTableCom
          :className="'quota_content_table_dialog'"
          :Data="data"
          :currNode="currNode"
          :list="list"
          :projectId="projectId"
          :saveLocalStore="saveLocalStore"
        />
      </div>
    </el-dialog>
  </div>
</template>
<script setup>
// 资源导入
import { reactive, onMounted, defineProps, watch, ref, defineEmits, nextTick } from "vue";
import { useRouter, useRoute } from "vue-router";
import { Plus, Edit, CircleCloseFilled } from "@element-plus/icons-vue";
// import draggable from "vuedraggable";
import drag from "@/static/images/drag.png";
import importIcon from "@/static/images/import.png";
import Sortable from "sortablejs";
import { ElMessage } from "element-plus";
import useCodeArrStore from "@/store/modules/select";
// 组件
import drawerView from "./drawerView.vue";
import dialogView from "./dialogView.vue";
// import inputNum from "@/components/inputNum/index.vue";
// api
import {
  saveOrUpdate,
  quotaTemplateListOld,
  deleteTemplate,
  getStandardTreeSelect,
  quotaWorkerList,
  saveOrUpdateAdd,
  quotaProductList,
  saveOrUpdateProductMoney,
  quotaProductConditionList,
  quotaWorkerLists,
  saveOrUpdateMoney,
  quotaTemplateUpdateSort
} from "@/apis/createFile/index.js";
import { imgsUpload } from "@/apis/products/specifications";
import { getEnumAll } from "@/apis/products/specifications";
import useMultipartOssStore from "@/store/modules/multipartOssStore.js";
import RemarkEditor from "@/components/RemarkEditor";
const ossStore = useMultipartOssStore();
import fullScreenTableCom from "./fullScreenTableCom.vue";
// 变量定义
const tableRef = ref();
const router = useRouter();
const route = useRoute();
const emits = defineEmits("ok");
const props = defineProps({
  currNode: {
    type: Object,
    default: () => {}
  },
  list: {
    type: Array,
    default: () => {
      return [];
    }
  },
  projectId: {
    type: String,
    default: ""
  },
  saveLocalStore: {
    type: Function,
    default: null
  }
});
const data = reactive({
  tableData: [],
  unitList: [],
  isAccept: false,
  // add人工
  isShowPepole: false,
  pepoleList: [],
  options: [
    {
      value: "guide",
      label: "Guide",
      children: [
        {
          value: "consistency",
          label: "Consistency"
        },
        {
          value: "feedback",
          label: "Feedback"
        }
      ]
    }
  ],
  materialsAndProcesses: {}, //材料及工艺说明对象
  acceptanceCriteria: { videoUrlList: [], picUrlList: [] },
  isMainMaterials: false, //成本主材弹框显隐藏属性
  isAuxiliary: false,
  isLabor: false, //报价人工弹窗
  quota_worker_type: [], //工种名称
  quota_charge_type: [], //定额计费方式
  costTotalPrice: 0, //人工成本总价
  // 报价主材
  mainMaterialsList: [],
  costTotalMoney: 0,
  quoteTotalMoney: 0,
  checkType: null,
  num: 1, //报价判断是否为主材辅材，1，主，2辅
  quotaId: "", //点击报价主材辅材获取的quotaId
  // 辅材
  bjAuxiliaryMaterials: [],
  costTotalMoneybj: 0,
  quoteTotalMoneybj: 0,
  // 报价
  manualQuotationData: [], //人工
  costTotalMoneybjp: 0,
  quoteTotalMoneybjp: 0,
  // 报价辅材
  limitProductNum: 0,
  limitProductMoney: 0
});
const deType = ref(null); //定额类型：1-主材  2-辅材
const isFullScreen = ref(false);

// 编辑时删除工艺图片
const handelClickDeletPicter = (item, index) => {
  data.acceptanceCriteria.picUrlList.splice(index, 1);
};
// 删除工艺视频
const handelClickDeletVideo = (item, index) => {
  data.acceptanceCriteria.videoUrlList.splice(index, 1);
};
const rowDrop = () => {
  const tbody = document.querySelector(".quota_content_table .el-table__body-wrapper tbody");
  console.log("AAAAAAAAAA", tbody);
  Sortable.create(tbody, {
    animation: 150,
    ghostClass: "blue-background-class",
    handle: ".my-handle",
    onEnd({ newIndex, oldIndex }) {
      // console.log(99999, newIndex, oldIndex);
      data.tableData.splice(newIndex, 0, data.tableData.splice(oldIndex, 1)[0]);
      const newArray = data.tableData.slice(0);
      data.tableData = [];
      nextTick(function () {
        newArray.map((item, index) => {
          item.showOrder = index + 1;
        });
        data.tableData = newArray;
        console.log("拖拽后的数据===", data.tableData);
        quotaTemplateUpdateSortFun(newArray);
      });
    }
  });
};

const quotaTemplateUpdateSortFun = arr => {
  quotaTemplateUpdateSort({ sortReqList: arr }).then(res => {
    if (res.code === 200) {
      ElMessage({
        message: "拖拽排序修改成功",
        type: "success"
      });
    }
  });
};
const handelInputAttritionRate = item => {
  // item.lostRate = item.lostRate.replace(/[^0-9.]/g, "").replace(/(\..*)\./g, "$1");
  // if (item.lostRate > 100) {
  //   item.lostRate = "";
  //   return;
  // }
  const parms = {
    projectId: props.projectId,
    quotaType: 1,
    ...item
  };
  saveOrUpdate(parms)
    .then(res => {
      console.log(res);
      if (res.code == 200) {
        ElMessage({
          type: "success",
          message: "保存成功"
        });
        getList();
      }
    })
    .catch(err => {
      console.log(err);
    });
};
const handelClickMainMaterials = (item, num) => {
  // console.log(99999, item);
  // num=1时为主材，2时为辅材
  router.push({
    path: "/quota-main-materials",
    query: {
      quotaId: item.quotaId,
      num: num, //1主材，2辅材
      mainProductShowType: num === 1 ? item.mainProductShowType : item.auxiliaryProductShowType //1 商品 2 组合
    }
  });
};
// 当主材没有导入修改事件
const handleChangeMainCostMoney = item => {
  const parms = {
    projectId: props.projectId,
    quotaType: 1,
    ...item
  };
  saveOrUpdate(parms)
    .then(res => {
      console.log(res);
      if (res.code == 200) {
        ElMessage({
          type: "success",
          message: "保存成功"
        });
        getList();
      }
    })
    .catch(err => {
      console.log(err);
    });
};
// 新增人工
const quotaId = ref("");
const handelClickAddPepole = item => {
  data.isShowPepole = true;
  quotaId.value = item.quotaId;
  getPepoleList();
};
const getPepoleList = () => {
  if (data.isShowPepole) {
    quotaWorkerList(quotaId.value).then(res => {
      const artificialArr = isArray(res.data.quotaWorkerVOList) ? res.data.quotaWorkerVOList : [];
      artificialArr.map(it => {
        it.workerType = it.workerType.toString();
        it.unit = it.unit.toString();
      });
      data.pepoleList = res.data.quotaWorkerVOList;
      data.costTotalPrice = res.data.costTotalPrice;
    });
  }
};
const handelClosePepole = () => {
  data.isShowPepole = false;
};
// 添加人工
const handelAddPepole = () => {
  data.pepoleList.push({
    ids: Date.now(),
    workerType: "",
    unit: "",
    costUnitPrice: 0,
    workerNum: 0,
    costTotalPrice: 0
  });
};
// 人工确认添加
const handelClickConfirmAdd = () => {
  const parms = {
    quotaId: quotaId.value,
    workerDetailsList: data.pepoleList
  };
  saveOrUpdateAdd(parms).then(res => {
    if (res.code == 200) {
      ElMessage({
        type: "success",
        message: "添加成功"
      });
      data.isShowPepole = false;
      getList();
    } else {
      ElMessage({
        type: "error",
        message: res.msg
      });
    }
  });
};
// 人工删除
const handelClickDeletPepol = item => {
  let index = data.pepoleList.findIndex(citem => citem.ids === item.ids);
  if (index > -1) {
    data.pepoleList.splice(index, 1);
  }
};
// 获取数据字典
const getEnumAlls = async () => {
  await getEnumAll()
    .then(res => {
      console.log(res);
      let arr = [];
      res.data.map(it => {
        if (it.dictId == 134) {
          it.dictDataList.map(cit => {
            arr.push({ label: cit.dictLabel, value: cit.dictValue });
          });
        } else if (it.dictType === "quota_charge_type") {
          it.dictDataList.map(cit => {
            (cit.label = cit.dictLabel), (cit.value = cit.dictValue);
          });
          data.quota_charge_type = it.dictDataList;
        } else if (it.dictType === "quota_worker_type") {
          it.dictDataList.map(cit => {
            (cit.label = cit.dictLabel), (cit.value = cit.dictValue);
          });
          data.quota_worker_type = it.dictDataList;
        }
      });

      data.unitList = arr;
    })
    .catch(err => {
      console.log(err);
    });
};
// 报价辅材-----------------------
const nums = ref(1);
const handelClickMainMaterialsCbauxiliaryQuoteMoney = (item, num) => {
  deType.value = 2; //辅材
  console.log(item, "9999", num);
  if (item.auxiliaryProductShowType == 1) {
    data.isMainMaterials = true;
    data.quotaId = item.quotaId;
    nums.value = num;
    quotaProductList(item.quotaId, num)
      .then(res => {
        data.costTotalMoney = res.data.costTotalMoney;
        data.quoteTotalMoney = res.data.quoteTotalMoney;
        data.mainMaterialsList = res.data.productVOList;
      })
      .catch(err => {
        console.log(err);
      });
  } else {
    handelClickQuotationAuxiliaryMaterials(item, 2);
  }
};
// 报价主材-----------------------
const handelClickMainMaterialsCb = (item, num) => {
  deType.value = 1; //主材
  console.log(item, "9999", num);
  if (item.mainProductShowType == 1) {
    data.isMainMaterials = true;
    data.quotaId = item.quotaId;
    nums.value = num;
    quotaProductList(item.quotaId, num)
      .then(res => {
        data.costTotalMoney = res.data.costTotalMoney;
        data.quoteTotalMoney = res.data.quoteTotalMoney;
        data.mainMaterialsList = res.data.productVOList;
      })
      .catch(err => {
        console.log(err);
      });
  } else {
    handelClickQuotationAuxiliaryMaterials(item, 1);
  }
};
const handelCloseMainMater = () => {
  data.isMainMaterials = false;
};
const handelSaveBjZc = () => {
  const parms = {
    quotaId: data.quotaId,
    infoReqList: data.mainMaterialsList,
    productType: nums.value
  };
  saveOrUpdateProductMoney(parms).then(res => {
    if (res.code == 200) {
      ElMessage({
        type: "success",
        message: "保存成功"
      });
      data.isMainMaterials = false;
      getList();
    } else {
      ElMessage({
        type: "error",
        message: res.msg
      });
    }
  });
};
// 报价定额辅材-------------
const handelCloseAuxiliaryMaterials = () => {
  data.isAuxiliary = false;
};
const handelSavefc = () => {
  data.isAuxiliary = false;
};
const handelClickQuotationAuxiliaryMaterials = (item, num) => {
  data.isAuxiliary = true;
  data.quotaId = item.quotaId;
  quotaProductConditionList(item.quotaId, num)
    .then(res => {
      console.log(res);
      data.limitProductMoney = res.data.limitProductMoney;
      data.limitProductNum = res.data.limitProductNum;
      data.bjAuxiliaryMaterials = res.data.voList;
    })
    .catch(err => {
      console.log(err);
    });
};
// 报价人工
const handelClickLabor = item => {
  data.isLabor = true;
  data.quotaId = item.quotaId;
  quotaWorkerLists(item.quotaId).then(res => {
    data.costTotalMoneybjp = res.data.costTotalPrice;
    data.quoteTotalMoneybjp = res.data.quoteTotalPrice;
    data.manualQuotationData = res.data.quotaWorkerVOList;
  });
};
const handelSubmitPbj = () => {
  const parms = {
    quotaId: data.quotaId,
    workerMoneyDetailsList: data.manualQuotationData
  };
  saveOrUpdateMoney(parms).then(res => {
    if (res.code == 200) {
      ElMessage({
        type: "success",
        message: "保存成功"
      });
      data.isLabor = false;
      getList();
    } else {
      ElMessage({
        type: "error",
        message: res.msg
      });
    }
  });
};
const handelCloseLabor = () => {
  data.isLabor = false;
};
// 获取列表
const getList = () => {
  quotaTemplateListOld(props.projectId).then(res => {
    res.data.map(it => {
      it.isStatus = it.quotaState == 0 ? false : true;
      if (it.unit !== null) {
        it.unit = it.unit.toString();
      }
    });
    data.tableData = res.data;
  });
};
const handelClickNewAdd = () => {
  const parms = {
    projectId: props.projectId,
    quotaType: 1
  };
  saveOrUpdate(parms)
    .then(res => {
      console.log(res);
      if (res.code == 200) {
        ElMessage({
          type: "success",
          message: "创建成功"
        });
        getList();
      }
    })
    .catch(err => {
      console.log(err);
    });
};
// 定额名称实时保存
const handelChangequotaName = item => {
  const parms = {
    projectId: props.projectId,
    quotaType: 1,
    ...item
  };
  saveOrUpdate(parms)
    .then(res => {
      console.log(res);
      if (res.code == 200) {
        ElMessage({
          type: "success",
          message: "保存成功"
        });
        getList();
      }
    })
    .catch(err => {
      console.log(err);
    });
};
const handelChangeSwitch = item => {
  item.quotaState = item.isStatus ? 1 : 0;
  const parms = {
    projectId: props.projectId,
    quotaType: 1,
    ...item
  };

  // delete item.isStatus;

  saveOrUpdate(parms)
    .then(res => {
      console.log(res);
      if (res.code == 200) {
        ElMessage({
          type: "success",
          message: item.isStatus === 1 ? "定额启用成功" : "定额禁用成功"
        });
        getList();
      } else {
        getList();
      }
    })
    .catch(err => {
      console.log(err);
      getList();
    });
};
// 修改单位保存
const handelChangeUnit = item => {
  const parms = {
    projectId: props.projectId,
    quotaType: 1,
    ...item
  };
  saveOrUpdate(parms)
    .then(res => {
      console.log(res);
      if (res.code == 200) {
        ElMessage({
          type: "success",
          message: "保存成功"
        });
        getEnumAlls();
        getList();
      }
    })
    .catch(err => {
      console.log(err);
    });
};
// 删除
const handelClickDelet = item => {
  deleteTemplate(item.quotaId).then(res => {
    if (res.code == 200) {
      ElMessage({
        type: "success",
        message: "删除成功"
      });
      getList();
    }
  });
};
const chosenObject = ref({});
// 工程验收标准
const handelClickEditAccept = item => {
  data.isAccept = true;
  chosenObject.value = item;
  console.log(item);

  getStandardTreeSelect().then(res => {
    // const arr = [];
    res.data.map(it => {
      it.label = it.standardName;
      it.value = it.standardId;
      it.children = it.dtoChildren;
      it.dtoChildren?.map(cit => {
        cit.label = cit.standardName;
        cit.value = cit.standardId;
        cit.children = cit.dtoChildren;
        cit.dtoChildren?.map(ccit => {
          ccit.label = ccit.standardName;
          ccit.value = ccit.standardId;
          ccit.children = ccit.dtoChildren;
        });
      });
    });
    console.log(res.data, "最后的数据");
    data.materialsAndProcesses = item;
    // 回显
    data.acceptanceCriteria.picUrlList = data.materialsAndProcesses.picUrlList;
    data.acceptanceCriteria.picIdList = data.materialsAndProcesses.picIdList;
    data.acceptanceCriteria.videoUrlList = data.materialsAndProcesses.videoUrlList;
    data.acceptanceCriteria.videoIdList = data.materialsAndProcesses.videoIdList;
    data.acceptanceCriteria.shortcomingDesc = data.materialsAndProcesses.shortcomingDesc;
    data.acceptanceCriteria.standardDesc = data.materialsAndProcesses.standardDesc;
    data.options = res.data;
  });
};
//====================================图片上传========================================================================================
const FileList = ref([]); //商品图片list
const imgFileList = ref([]); //编辑时商品图片list
const videoList = ref([]); //商品视频list
const uploadImg = ref();
const uploadVideo = ref();
const videoListAll = ref([]);
// const imgIsReady = ref(false);
import {
  getFolder,
  _debounce //防抖，多次频繁触发时，只执行最后一次
} from "@/utils/index";
import { isArray } from "lodash";
const handleAvatarChangeIcon = _debounce(async (file, fileList, type = "img") => {
  //选中文件触发的change事件
  console.log("触发文件上传==", fileList);
  let _fileList = fileList.filter(item => item.status === "ready"); //未上传成功的图片
  const flag = await fileType(type, type === "img" ? _fileList : [file]);
  if (!flag) {
    const errorFile = [];
    const successFile = [];
    if (type === "img") {
      ElMessage({
        message: "只能上传jpeg，jpg，png图片文件，大小不超过5M",
        type: "error",
        offset: 60
      });
      for (let item of _fileList) {
        if (!(item.raw.type === "image/jpeg" || item.raw.type === "image/png") || item.raw.size > 1024 * 1024 * 5) {
          errorFile.push(item);
        } else {
          successFile.push(item);
        }
      }
      // const errorFile = _fileList.filter(
      //   item => !(item.raw.type === "image/jpeg" || item.raw.type === "image/png") || item.raw.size > 1024 * 1024 * 5
      // );
      for (let item of errorFile) {
        uploadImg.value.handleRemove(item);
      }
    } else if (type === "video") {
      ElMessage({
        message: "只能上传视频文件，并且视频时长不超过45秒，大小不超过100M",
        type: "error",
        offset: 60
      });
      for (let item of _fileList) {
        if (!(item.raw.type === "video/mp4") || item.raw.size > 1024 * 1024 * 100) {
          errorFile.push(item);
        } else {
          successFile.push(item);
        }
      }
      // const errorFile = _fileList.filter(item => !(item.raw.type === "video/mp4"));
      for (let item of errorFile) {
        uploadVideo.value.handleRemove(item);
      }
      return;
    }
    if (successFile.length <= 0) return;
  }
  //   imgIsReady.value = false;
  if (type === "img") {
    FileList.value = fileList;

    for (let item of _fileList) {
      await customUpload(item, { file: item }, type);
    }
  } else {
    // videoList.value = fileList;
    videoList.value = [file];

    for (let item of videoList.value) {
      await customUpload(item, { file: item }, type);
    }
  }
}, 100);
/**
 * 校验文件类型
 */
const fileType = async (type, fileList) => {
  let flag = true;
  if (type === "img") {
    for (let item of fileList) {
      if (!((item.raw.type === "image/jpeg" || item.raw.type === "image/png") && item.raw.size <= 1024 * 1024 * 5)) {
        flag = false;
      }
      if (!(item.raw.type === "image/jpeg" || item.raw.type === "image/png")) {
        flag = false;
      }
    }
  } else if (type === "video") {
    for (let item of fileList) {
      // console.log("视频的大小===", item.raw.size);
      if (!(item.raw.type === "video/mp4" && item.raw.size <= 1024 * 1024 * 100)) {
        flag = false;
      }
      if (item.raw.type === "video/mp4") {
        await getTimes(item.raw);
        // console.log("视频的时长===", item.raw.size <= 1024 * 1024 * 100, videoTime.value);
        if (!(videoTime.value <= 45)) {
          flag = false;
        }
      }
    }
  }
  return flag;
};
/**
 * 获取视频时间长度
 */
const videoTime = ref(0);
const getTimes = async file => {
  let content = file;
  //获取录音时长
  let url = URL.createObjectURL(content);
  //经测试，发现audio也可获取视频的时长
  let audioElement = new Audio(url);
  console.log(2222);
  await new Promise((resolve, reject) => {
    audioElement.addEventListener("loadedmetadata", _event => {
      //保存获取时间长度
      videoTime.value = parseInt(audioElement.duration);
      resolve("时长获取成功");
    });
  });
};

/**
 * 上传
 */
const getFileName = name => {
  const arr = name.split(".");
  const _arr = JSON.parse(JSON.stringify(arr));
  let _name = "";
  let _suffix = "";
  if (arr.length > 2) {
    _arr.splice(_arr.length - 1, 1);
    _name = _arr.join(".");
    _suffix = arr[arr.length - 1];
  } else {
    _name = arr[0];
    _suffix = arr[1];
  }
  const folder = getFolder();
  return folder + _name + new Date().getTime() + "." + _suffix;
};
const customUpload = async (item, option, type) => {
  // 合并已上传和当前上传文件
  const objName = getFileName(option.file.name);
  await ossStore
    .submit(objName, option.file.raw)
    .then(async res => {
      await ossStore.setACL(objName, fileReadRole.publicRead);
      res.fileUrl = await ossStore.signatureUrl(objName);
      console.log("文件上传成功，地址为===", res.fileUrl.split("?")[0]);
      if (type === "img") {
        item["img"] = res.fileUrl.split("?")[0];
        // data.acceptanceCriteria.picUrlList.push(res.fileUrl.split("?")[0]);
      } else {
        item["video"] = res.fileUrl.split("?")[0];
        console.log("视频===", videoList.value);
        data.acceptanceCriteria?.videoUrlList?.push(videoList.value[0].video);
        console.log(data.acceptanceCriteria?.videoUrlList, "videoListAll");
      }
      item["folder"] = objName;

      const Option = JSON.parse(JSON.stringify(option));
      uploadIMG(Option); //图片上传到业务端
    })
    .catch(err => {
      alert(JSON.stringify(err));
    });
};

//将图片上传到业务端服务
const uploadIMG = option => {
  const nameArr = option.file.name.split(".");
  const uploadArr = [
    {
      fileId: option.file.uid,
      objectName: option.file.folder, //目录＋文件名称
      url: option.file.img || option.file.video,
      access: "public-read",
      fileName: option.file.name, //文件名称
      bucketName: "51-jzt-dev",
      size: option.file.size,
      type: true,
      suffix: nameArr[nameArr.length - 1]
    }
  ];
  imgsUpload(uploadArr).then(res => {
    console.log(909090, res);
  });
};
const fileReadRole = {
  defaultRole: "",
  privateRole: "private",
  publicRead: "public-read",
  publicReadWrite: "public-read-write"
};
// 选择引用平台标准
const handelChangeCascader = arr => {
  // console.log(arr);
  if (!arr) return;
  const id = arr[arr.length - 1];
  console.log(id);
  data.options.map(it => {
    if (it.standardId === arr[0]) {
      console.log(it);
      it.children?.map(cit => {
        cit.children?.map(ccit => {
          if (ccit.standardId == id) {
            // console.log(ccit, "44444");
            data.acceptanceCriteria = ccit;
          }
        });
      });
    }
  });
};
// 确定引用
const handelClickOk = () => {
  emits("ok", data.acceptanceCriteria);
  console.log(data.materialsAndProcesses, "data.acceptanceCriteria");

  data.materialsAndProcesses.picUrlList = data.acceptanceCriteria.picUrlList;
  data.materialsAndProcesses.picIdList = data.acceptanceCriteria.picIdList;
  data.materialsAndProcesses.videoUrlList = data.acceptanceCriteria.videoUrlList;
  data.materialsAndProcesses.videoIdList = data.acceptanceCriteria.videoIdList;
  data.materialsAndProcesses.shortcomingDesc = data.acceptanceCriteria.shortcomingDesc;
  data.materialsAndProcesses.standardDesc = data.acceptanceCriteria.standardDesc;
  data.isAccept = false;
  const parms = {
    projectId: props.projectId,
    quotaType: 1,
    ...data.materialsAndProcesses
  };
  saveOrUpdate(parms)
    .then(res => {
      console.log(res);
      if (res.code == 200) {
        ElMessage({
          type: "success",
          message: "保存成功"
        });
        // getList();
      }
    })
    .catch(err => {
      console.log(err);
    });
};
// 取消
const handelClickBack = () => {
  data.isAccept = false;
};
onMounted(async () => {
  await getEnumAlls();
  // setTimeout(() => {
  //   rowDrop();
  //   console.log("可以开始拖拽了");
  // }, 500);
});
// 监听
watch(
  () => props.list,
  arr => {
    console.log(arr, "获取到的定额数据.....");
    data.tableData = JSON.parse(JSON.stringify(arr));
  },
  { deep: true, immediate: true }
);
watch(
  () => imgFileList.value,
  list => {
    console.log(list, "wwww");
    let arr = [];
    list.map(it => {
      arr.push(it.img);
    });
    data.acceptanceCriteria.picUrlList = arr;
    console.log(arr, "---------------");
  },
  { deep: true }
);
// 人工成本总价
watch(
  () => data.pepoleList,
  list => {
    let sum = list.reduce(
      (accumulator, currentItem) => accumulator + Number(currentItem.workerNum) * Number(currentItem.costUnitPrice),
      0
    );
    data.costTotalPrice = sum;
  },
  { deep: true }
);
</script>

<atyle lang="scss">
.quota-full-dialog {
  .el-dialog {
    padding-bottom: 0 !important;
  }
  .el-dialog__header {
    border-bottom: 1px solid #dcdfe6;
    margin: 0 -24px;
    padding: 0 20px 20px 20px;
  }
  .el-dialog__headerbtn .el-icon {
    width: 24px !important;
    height: 24px !important;
  }
  .el-icon.el-dialog__close {
    background: url("@/assets/images/close-full-icon.png");
    background-size: cover;
    svg {
      display: none;
    }
  }
}
</atyle>
<style scoped lang="scss">
:deep(.el-table) {
  td {
    .el-button.el-button--primary.is-link.border {
      border-bottom: 1px solid #007dff;
    }
    .el-button.el-button--danger.is-link.border.red {
      color: #ff3333;
      &:hover {
        color: #ff3333;
      }
      border-bottom: 1px solid #ff3333;
    }
  }
  .el-input__wrapper,
  .el-select__wrapper {
    background-color: white !important;
  }
}
:deep(.el-textarea__inner) {
  min-height: 100px !important;
}
// 报价--------------
.title {
  height: 50px;
  display: flex;
  align-items: center;
  span {
    font-size: 16px;
    color: #86909c;
  }
}
.content_list {
  height: 460px;
  overflow-y: auto;
  .child {
    display: flex;
    min-height: 100px;
    justify-content: space-between;
    background: #f6f8fa;
    border-radius: 4px 4px 4px 4px;
    padding: 20px;
    margin-bottom: 20px;
    .child_left {
      .top {
        font-size: 14px;
        color: #303133;
        padding: 0;
        background-color: transparent;
      }
      ul {
        display: flex;
        align-items: center;
        li {
          padding: 6px 10px;
          background: #ffffff;
          border-radius: 20px 20px 20px 20px;
          border: 1px solid #e1e6ed;
          box-sizing: border-box;
          margin: 0 10px 0 0;
        }
      }
    }
    .child_right {
      display: flex;
      align-items: center;
      div {
        display: flex;
        align-items: center;
        :deep(.el-input) {
          width: 80px;
        }
      }
    }
  }
}
// 报价----end
// 报价成本主材
.total_pic {
  display: flex;
  align-items: center;
  height: 40px;
  span {
    font-size: 18px;
  }
}
// 人工
.top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 10px;
  height: 60px;
  background-color: #fff;
  span {
    font-size: 18px;
  }
}
.btn {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  bottom: 0;
  width: 100%;
  button:nth-child(1) {
    background-color: #f2f3f5;
    width: 92px;
    height: 32px;
  }
}
.quota_content {
  display: flex;
  flex-direction: column;
  .quota_content_header {
    padding-top: 20px;
    max-height: 40px;
    // background-color: #ccc;
    min-height: 40px;
    position: sticky;
    top: 0;
    z-index: 22;
    background-color: white;
  }
  .quota_content_table {
    height: auto;
    height: calc(100% - 30px);
    overflow-y: scroll;
  }
}
.operate {
  display: flex;
  align-items: center;
}
.process_description {
  display: flex;
  align-items: center;
  :deep(.el-icon) {
    cursor: pointer;
  }
}
.attrition_rate {
  display: flex;
  align-items: center;
  :deep(.el-input) {
    // width: 50%;
  }
}
.quota_import {
  // display: flex;
  // align-items: center;
  div {
    display: flex;
    align-items: center;
    cursor: pointer;
    img {
      width: 20px;
    }
  }
}
// 工程验收标准
.accept {
  :deep(.el-drawer__body) {
    padding: 0 !important;
    border-top-left-radius: 20px !important;
    border-bottom-left-radius: 20px !important;
  }
}
.accept_content {
  position: relative;
  height: 100%;
  .header {
    height: 75px;
    border-bottom: 1px solid #dcdfe6;
    box-sizing: border-box;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    &_left {
      padding-left: 20px;
      overflow: hidden;
      span {
        font-size: 18px;
        color: #303133;
      }
    }
    &_right {
      padding-right: 20px;
      overflow: hidden;
      :deep(.el-input__wrapper) {
        background-color: white;
        box-shadow: none;
        .el-input__inner {
          color: #007dff;
          text-align: right;
        }
        .el-input__inner::placeholder {
          color: #007dff;
        }
        .el-input__icon {
          color: #007dff;
        }
      }
      :deep(.el-cascader) {
        .el-input.is-focus .el-input__wrapper {
          box-shadow: none;
        }
      }
    }
  }
  .content {
    padding: 20px;
    height: calc(100% - 130px);
    overflow: scroll;
    button {
      background-color: transparent !important;
      border: 0 !important;
    }
    :deep(.el-form-item__content) {
      display: flex;
      flex-direction: column !important;
      align-items: start !important;
    }
  }
  .fottor {
    position: absolute;
    bottom: 0px;
    left: 0;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 80px;
    background-color: #fff;
    z-index: 222;
  }
}
.video_content {
  display: flex;
  flex-direction: row;
  align-items: center;
  // justify-content: center;
  overflow-x: scroll;
  flex-wrap: wrap;
  .video_item {
    width: 150px;
    height: auto;
    margin: 0 16px 0 0;
    position: relative;
    video {
      width: 100%;
      // height: 50%;
    }
    .close_icon {
      position: absolute;
      z-index: 99;
      right: 6px;
      top: 4px;
      cursor: pointer;
    }
    .close_icon :hover {
      color: #007dff;
    }
  }
}
.imgs {
  display: flex;
  flex-wrap: wrap;
  .standard_diagram_item {
    position: relative;
    img {
      width: 100px;
      height: 100px;
      margin: 0 10px 0 0;
    }
    .close_icon {
      position: absolute;
      right: 0px;
      top: -11px;
      z-index: 1;
      cursor: pointer;
    }
    .close_icon :hover {
      color: #007dff;
    }
  }
}
.quota_upload {
  display: flex;
  align-items: center;
}

.dialog_title {
  color: #131414;
  font-size: 18px;
}
.dialog_title::before {
  content: "";
  width: 6px;
  height: 6px;
  background-color: #409eff;
  border-radius: 50%;
  display: inline-block;
  margin-right: 10px;
  margin-bottom: 3px;
}
.dialog_content {
  padding: 25px 0 10px;
}
.dialog_footer {
  text-align: center;
}
</style>
